<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="../pages/layui/css/layui.css" rel="stylesheet">
    <script src="../pages/layui/layui.js"></script>
    <script src="../pages/vue/vue.min.js"></script>
</head>
<body>
<table class="layui-table" id="root" style="text-align: center">
    <colgroup>
        <col width="150">
        <col width="150">
        <col>
    </colgroup>
    <thead style="text-align: center">
    <tr>
        <th>分类</th>
        <th>菜名</th>
        <th>数量</th>
    </tr>
    </thead>
    <tbody>
    <tr v-for="item in list">
        <td>{{item.classify}}</td>
        <td>{{item.menu}}</td>
        <td>{{item.num}}</td>
    </tr>
    </tbody>
</table>
<script>
    let $ = layui.jquery;
    let layer = layui.layer;
    let form = layui.form;
    let vue = new Vue({
        el: "#root",
        data: {
            list: []
        }
    });
    $.ajax({
        url: "../business/selectMenuList",
        success: function (list) {
            vue.list = JSON.parse(list);
        }
    })

</script>
</body>
</html>